import 'package:flutter/material.dart';
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // 启动要显示的界面
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("商品内容"),
      ),
      body: JKHomeContent(),
    );
  }
}

class JKHomeContent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ListView(
      children: <Widget>[
        JJKHomeProductItem("Apple1", "MackBook1", "https://tva1.sinaimg.cn/large/006y8mN6gy1g72j6nk1d4j30u00k0n0j.jpg"),
        JJKHomeProductItem("Apple1", "MackBook1", "https://tva1.sinaimg.cn/large/006y8mN6gy1g72imm9u5zj30u00k0adf.jpg"),
        JJKHomeProductItem("Apple1", "MackBook1", "https://tva1.sinaimg.cn/large/006y8mN6gy1g72imqlouhj30u00k00v0.jpg")
      ],
    );
  }
}

class JJKHomeProductItem extends StatelessWidget {
  final String title;
  final String desc;
  final String imageUrl;

  JJKHomeProductItem(this.title, this.desc, this.imageUrl);
  @override
  Widget build(BuildContext context) {
    final style = TextStyle(fontSize: 20, color: Colors.orange);
    return Container(
      padding: EdgeInsets.all(8),
      decoration: BoxDecoration(
          border: Border.all(
              width: 8,
              color: Colors.orange
          )
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        children: <Widget>[
          SizedBox(height: 12,),
          Text(title, style: style,),
          SizedBox(height: 12,),
          Text(desc, style: style,),
          SizedBox(height: 12,),
          Image.network(imageUrl),
          SizedBox(height: 12,)
        ],
      ),
    );
  }
}

class JKHomeProductItem extends StatelessWidget {
  final String title;
  final String desc;
  final String imageUrl;

  JKHomeProductItem(this.title, this.desc, this.imageUrl);
  @override
  Widget build(BuildContext context) {
    final style = TextStyle(fontSize: 20, color: Colors.orange);
    return Column(
      crossAxisAlignment: CrossAxisAlignment.end,
      children: <Widget>[
        SizedBox(height: 12,),
        Text(title, style: style,),
        SizedBox(height: 12,),
        Text(desc, style: style,),
        SizedBox(height: 12,),
        Image.network(imageUrl),
        SizedBox(height: 12,)
      ],
    );
  }
}